:root[theme-mode=dark] {
    --gray-color: #7a7a7a;
    --gray-color-hover: #5f5f5f;
    --gray-color-light: rgba(125, 125, 125, 0.1);
    --primary-color: #46a9ff;
    --primary-color-hover: #71bdff;
    --primary-color-light: rgba(70, 169, 255, 0.1);
    --success-color: #21dd3a;
    --success-color-hover: #10c028;
    --success-color-light: rgba(0, 255, 0, 0.1);
    --warn-color: #e7a821;
    --warn-color-hover: #d19719;
    --error-color: #ff4b4b;
    --error-color-hover: #e63b3b;
    --error-color-light: #ffbebe;
    --font-size: 14px;
    --font-size-large: 18px;
    --font-size-small: 12px;
    --content-background-color: rgba(0, 0, 0, 0.7);
    --dialog-background-color: rgba(20, 20, 20, 0.6);
    --card-background-color: rgba(0, 0, 0, 0.3);
    --light-background-color: rgba(200, 200, 200, 0.2);
    --card-background-color-hover: rgba(255, 255, 255, 0.2);
    --gray-background-color: #b9b9b9;
    --font-color: #fff;
    --font-second-color: #adadad;
    --font-placeholder-color: #7e7e7e;
    --font-color-light: #333;
    --font-color-deep: #000;
    --border-color: #a1a1a1;
    --border-color-light: #696969;
    --shadow-color: rgba(200, 200, 200, 0.2);
    --box-shadow: 2px 2px 10px var(--shadow-color);
}